<!DOCTYPE HTML PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xml:lang="zh-CN" xmlns="http://www.w3.org/1999/xhtml" lang="zh-CN"><head>


<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>html+css小技巧收集！-飞飞</title>
<meta name="FEIFEI" content="http://CHENEFEI.COM">
<link rel="stylesheet" rev="stylesheet" href="38_files/style.css" type="text/css" media="screen">
<link rel="alternate" type="application/atom+xml" href="http://chenefei.com/atom.xml" title="飞飞">
<link rel="alternate" type="application/rss+xml" href="http://chenefei.com/rss.xml" title="飞飞">
<script language="JavaScript" src="38_files/common.js" type="text/javascript"></script>
</head><body>
<div id="header">
  <div class="nav">
    <h3 class="site-title"><a href="http://chenefei.com/" name="top">笨笨的飞飞</a></h3>
    <div class="nav-bg">
      <div class="nav-bg-l"></div>
      <ul class="nav-link">
        <li id="lsf" class="lsf">
          <script type="text/javascript" language="javascript">
		<!--
		   var sElementId = "searchform";
	var sText = "键入搜索关键字";
	var sStyelColorT = "#999";
	var sStyelColorF = "#000";
	var sStyelBkgrdF = "url(http://chenefei.com/style/images/search-bg.gif) bottom 10px no-repeat";
	var sStyelBkgrdF_IE = "url(http://chenefei.com/style/images/search-bg-ie.gif) top 10px no-repeat";
	var sStyelBkgrdB = "url(http://chenefei.com/style/images/search-bg.gif) top 10px no-repeat";
	var src_T = true;
	var ie = ((navigator.appName == "Microsoft Internet Explorer") && (parseInt(navigator.appVersion) >= 3 ));
	var lsf = document.getElementById("lsf");
	function onSearchInputInput(){
		src_T = false;
	}
	function onSearchInputFocus(pge_E) {
		if (ie) {
			lsf.style.background = sStyelBkgrdF_IE;
		} else {
			lsf.style.background = sStyelBkgrdF;
		}
		if (src_T) {
			src_T = false;
			pge_E.value = "";
			pge_E.style.color = sStyelColorF;
		}
		pge_E.select();
		pge_E.style.color = sStyelColorF;
	}
	function onSearchInputBlur(pge_E) {
		document.getElementById("lsf").style.background = sStyelBkgrdB;
		if (!pge_E.value) {
			src_T = true;
			pge_E.value = sText;
			pge_E.style.color = sStyelColorT;
		}
	}
function liveSearchSubmit() {
	if (document.getElementById("edtSearch").value=="") {
		alert(sText);
		return false;
	}
}
function closeResults() {
    $("LSResult").style.display = "none";
}
		//-->
		</script>
          <form onsubmit="return liveSearchSubmit()" id="searchform" name="searchform" method="post" action="http://chenefei.com/cmd.asp?act=Search">
            <input id="edtSearch" name="edtSearch" value="键入搜索关键字" oninput="onSearchInputInput()" onfocus="onSearchInputFocus(this)" onblur=" onSearchInputBlur(this)" style="color: rgb(153, 153, 153);" type="text">
            <input id="searchsubmit" style="display: none;" value="Search" type="submit">
            <!--[if IE]><div><![endif]-->
            <div id="LSResult" style="display: none;">
              <div id="LSShadow"></div>
            </div>
            <!--[if IE]></div><br /><![endif]-->
          </form>
        </li>
        <li class="page_item"><a href="http://chenefei.com/about.html">关于飞飞</a></li>
<li class="page_item"><a href="http://chenefei.com/stamp.asp">邮票册</a></li>
<li class="page_item"><a href="http://chenefei.com/article/">文档收藏</a></li>
<li class="page_item"><a href="http://chenefei.com/post/guestbook.html">留言板</a></li>
<li class="page_item"><a href="http://chenefei.com/cmd.asp?act=login">管理</a></li>
<li class="page_item"><a href="http://chenefei.com/search.asp">搜索</a></li>
<li class="page_item"><a href="http://chenefei.com/tags.asp">TAGs</a></li>
<li class="page_item"><a href="http://chenefei.com/">首页</a></li>


      </ul>
    </div>
  </div>
</div>
<div id="ggbt">  <script type="text/javascript"><!--
google_ad_client = "pub-0654540925974488";
google_ad_width = 728;
google_ad_height = 90;
google_ad_format = "728x90_as";
google_ad_type = "image";
//2007-03-27: 页面顶部
google_ad_channel = "0006676948";
//-->
</script>
  <script type="text/javascript" src="38_files/show_ads.js">
</script><iframe name="google_ads_frame" src="38_files/ads_004.htm" marginwidth="0" marginheight="0" vspace="0" hspace="0" allowtransparency="true" scrolling="no" width="728" frameborder="0" height="90"></iframe></div>
<div id="wrap"> ﻿
  <div id="sidebar">
    <ul>
      <li>
        <h2>日历</h2>
        <ul>
          <script language="JavaScript" src="38_files/c_html_js_004.asp" type="text/javascript"></script><div class="year2008 month7"><p class="y"><a href="http://chenefei.com/catalog.asp?date=2008-6">&lt;&lt;</a>  <a href="http://chenefei.com/catalog.asp?date=2008-7">2008·7</a>  <a href="http://chenefei.com/catalog.asp?date=2008-8">&gt;&gt;</a></p><p class="w">Sun</p><p class="w">Mon</p><p class="w">Tue</p><p class="w">Wen</p><p class="w">Thu</p><p class="w">Fri</p><p class="w">Sat</p><p class="nd"></p><p class="nd"></p><p class="d">1</p><p class="yd"><a class="l" href="http://chenefei.com/post/262.html">2</a></p><p class="d">3</p><p class="d">4</p><p class="d">5</p><p class="d">6</p><p class="yd"><a class="l" href="http://chenefei.com/post/263.html">7</a></p><p class="d">8</p><p class="d">9</p><p class="d">10</p><p class="d">11</p><p class="d">12</p><p class="d">13</p><p class="d">14</p><p class="yd"><a class="l" href="http://chenefei.com/post/264.html">15</a></p><p class="d">16</p><p class="d">17</p><p class="d">18</p><p class="d">19</p><p class="d">20</p><p class="d">21</p><p class="d">22</p><p class="d">23</p><p class="d">24</p><p class="d">25</p><p class="d">26</p><p class="d">27</p><p class="d">28</p><p class="d">29</p><p class="d">30</p><p class="d">31</p><p class="nd"></p><p class="nd"></p></div>
          <div style="clear: both;">
            <!---->
          </div>
        </ul>
      </li>
      <li>
        <h2>网站目录</h2>
        <ul>
          <script language="JavaScript" src="38_files/c_html_js_005.asp" type="text/javascript"></script><li><a href="http://chenefei.com/XML/7.xml"><img src="38_files/rss3.gif" alt="Catalog RSS" width="27" height="12"></a>&nbsp;<a href="http://chenefei.com/catalog.asp?cate=7">MyLife (79)</a></li><li><a href="http://chenefei.com/XML/10.xml"><img src="38_files/rss3.gif" alt="Catalog RSS" width="27" height="12"></a>&nbsp;<a href="http://chenefei.com/catalog.asp?cate=10">文章收藏 (18)</a></li><li><a href="http://chenefei.com/XML/1.xml"><img src="38_files/rss3.gif" alt="Catalog RSS" width="27" height="12"></a>&nbsp;<a href="http://chenefei.com/catalog.asp?cate=1">特效收集 (17)</a></li><li><a href="http://chenefei.com/XML/6.xml"><img src="38_files/rss3.gif" alt="Catalog RSS" width="27" height="12"></a>&nbsp;<a href="http://chenefei.com/catalog.asp?cate=6">系统相关 (11)</a></li><li><a href="http://chenefei.com/XML/12.xml"><img src="38_files/rss3.gif" alt="Catalog RSS" width="27" height="12"></a>&nbsp;<a href="http://chenefei.com/catalog.asp?cate=12">义乌传说 (8)</a></li><li><a href="http://chenefei.com/XML/11.xml"><img src="38_files/rss3.gif" alt="Catalog RSS" width="27" height="12"></a>&nbsp;<a href="http://chenefei.com/catalog.asp?cate=11">新奇世界 (5)</a></li><li><a href="http://chenefei.com/XML/9.xml"><img src="38_files/rss3.gif" alt="Catalog RSS" width="27" height="12"></a>&nbsp;<a href="http://chenefei.com/catalog.asp?cate=9">网站收藏 (3)</a></li><li><a href="http://chenefei.com/XML/13.xml"><img src="38_files/rss3.gif" alt="Catalog RSS" width="27" height="12"></a>&nbsp;<a href="http://chenefei.com/catalog.asp?cate=13">第三只眼 (2)</a></li><li><a href="http://chenefei.com/XML/14.xml"><img src="38_files/rss3.gif" alt="Catalog RSS" width="27" height="12"></a>&nbsp;<a href="http://chenefei.com/catalog.asp?cate=14">爱色影 (2)</a></li><li><a href="http://chenefei.com/XML/2.xml"><img src="38_files/rss3.gif" alt="Catalog RSS" width="27" height="12"></a>&nbsp;<a href="http://chenefei.com/catalog.asp?cate=2">标准点滴 (11)</a></li><li><a href="http://chenefei.com/XML/8.xml"><img src="38_files/rss3.gif" alt="Catalog RSS" width="27" height="12"></a>&nbsp;<a href="http://chenefei.com/catalog.asp?cate=8">广告&amp;创意类 (5)</a></li><li><a href="http://chenefei.com/XML/3.xml"><img src="38_files/rss3.gif" alt="Catalog RSS" width="27" height="12"></a>&nbsp;<a href="http://chenefei.com/catalog.asp?cate=3">web编程 (45)</a></li><li><a href="http://chenefei.com/XML/5.xml"><img src="38_files/rss3.gif" alt="Catalog RSS" width="27" height="12"></a>&nbsp;<a href="http://chenefei.com/catalog.asp?cate=5">服务器相关 (34)</a></li><li><a href="http://chenefei.com/XML/4.xml"><img src="38_files/rss3.gif" alt="Catalog RSS" width="27" height="12"></a>&nbsp;<a href="http://chenefei.com/catalog.asp?cate=4">嘻嘻哈哈 (24)</a></li>
        </ul>
      </li>
      <li>
        <h2>最新留言</h2>
        <ul>
          <script language="JavaScript" src="38_files/c_html_js_003.asp" type="text/javascript"></script><li><a href="http://chenefei.com/post/263.html#cmt501" title="2008-7-31 10:06:34 Post by ss">hey,find [ur...</a></li><li><a href="http://chenefei.com/post/264.html#cmt500" title="2008-7-31 9:48:05 Post by google">googleָָվ[ur...</a></li><li><a href="http://chenefei.com/post/264.html#cmt499" title="2008-7-31 9:28:20 Post by games">wow account ...</a></li><li><a href="http://chenefei.com/post/185.html#cmt496" title="2008-7-28 18:03:14 Post by 飞飞">没有解决，因为无法重现事故现场~</a></li><li><a href="http://chenefei.com/post/185.html#cmt495" title="2008-7-28 17:40:38 Post by 野兽">IIS 启动的时候出了点...</a></li><li><a href="http://chenefei.com/post/196.html#cmt493" title="2008-7-21 18:59:36 Post by 飞飞">你的原因很可能是你装的是...</a></li><li><a href="http://chenefei.com/post/196.html#cmt490" title="2008-7-21 10:34:46 Post by sasa">哪位高手帮忙，错在哪？</a></li><li><a href="http://chenefei.com/post/196.html#cmt489" title="2008-7-21 10:33:53 Post by sasa">我运行#mysqldum...</a></li><li><a href="http://chenefei.com/post/264.html#cmt488" title="2008-7-17 21:27:30 Post by 飞飞">我这里也差不多了,这株是...</a></li><li><a href="http://chenefei.com/post/264.html#cmt487" title="2008-7-17 20:48:55 Post by 丹丹">我家后面也有一棵一模一样...</a></li><li><a href="http://chenefei.com/post/264.html#cmt485" title="2008-7-16 20:36:39 Post by 飞飞">呵呵,你又不是不知道,这...</a></li><li><a href="http://chenefei.com/post/264.html#cmt484" title="2008-7-16 19:40:57 Post by 杨">这些烤的石斑鱼看起来味道...</a></li>
        </ul>
      </li>
      <li>
        <h2>最近发表</h2>
        <ul>
          <script language="JavaScript" src="38_files/c_html_js.asp" type="text/javascript"></script><li><a href="http://chenefei.com/post/264.html">我的家乡:这个夏天有点甜</a></li><li><a href="http://chenefei.com/post/263.html">“七·七卢沟桥事变”71周年</a></li><li><a href="http://chenefei.com/post/262.html">TIME评选的08年50个最棒的网站[转]</a></li><li><a href="http://chenefei.com/post/261.html">功夫熊猫:一场绝无偶然的政治阴谋</a></li><li><a href="http://chenefei.com/post/260.html">dos, 原来也可以加密滴</a></li><li><a href="http://chenefei.com/post/259.html">发现一个有意思的昆虫网站</a></li><li><a href="http://chenefei.com/post/258.html">美国东部时间下午1点:暗黑破坏神3!</a></li><li><a href="http://chenefei.com/post/257.html">绣湖随拍---无聊的雨天</a></li><li><a href="http://chenefei.com/post/256.html">[父亲节]google的PIN码到了</a></li><li><a href="http://chenefei.com/post/255.html">记住那些瞬间----纪念汶川地震</a></li><li><a href="http://chenefei.com/post/254.html">词条管理----流行语释义</a></li><li><a href="http://chenefei.com/post/253.html">晒晒养的花----初试相机</a></li><li><a href="http://chenefei.com/post/252.html">几个不错的公司BLOG[转]</a></li><li><a href="http://chenefei.com/post/251.html">外国人的幽默</a></li><li><a href="http://chenefei.com/post/250.html">谁说没有好广告</a></li>
        </ul>
      </li>
      <li>
        <h2>链 接</h2>
        <ul>
          <li class="feifei" style="color: red;">这里是收藏夹</li><li><a href="http://www.blueidea.com/" target="_blank" title="表告诉我你不知道这个是啥－_－!">蓝色理想</a></li><li><a href="http://bbs.blueidea.com/" target="_blank" title="表告诉我你不知道这个是啥－_－!">经典论坛</a></li>
<li><a href="http://www.51windows.net/hw/asp/myjs.htm" target="_blank" title="呃。表告诉我你不知道这个家伙">海娃的myjs</a></li>
<li><a href="http://bbs.chinaunix.net/index.php?sid=FWyLev" title="cuer乐园">unix社区</a></li><li><a href="http://www.freebsdchina.org/forum/index.php" target="_blank" title="FREEBSD的中文官方站">Freebsd中文论坛</a></li><li><a href="http://www.extmail.org/forum/index.php" target="_blank" title=" Postfix在中国">邮件开发网</a></li><li><a href="http://lex.w3.org.cn/" target="_blank" title="技术牛man">没壳的小龟</a></li>
<li><a href="http://andymao.com/andy/" target="_blank" title="看他的东西。感觉很好">小毅的blog</a></li>
<li><a href="http://www.21andy.com/blog/" target="_blank" title="有几个技术帖子很不错。。就收藏了。。">www.21andy.com/blog/</a></li><li><a href="http://www.iyiwu.com/" target="_blank" title="爱义乌 爱商贸----义乌商贸论坛">义乌论坛</a></li>
<li class="feifei" style="color: red;">飞飞的圈子</li>
<li><a href="http://chenefei.com/" alt="飞飞" title="飞飞">笨笨的飞飞</a></li>
<li><a href="http://www.imfei.com/" alt="义乌花卉网" titile="那飞的花坞">义乌花卉网</a></li><li><a href="http://www.btdyw.com/" alt="比特电影" titile="BT下载">比特电影网</a></li>
<li><a href="http://chyf1982.blueidea.com/" target="_blank" title="偶在蓝色的blog!">蓝色的飞飞</a></li><li><a href="http://sheneyan.com/" target="_blank" title="很热情的牛B的汉子">子乌的叶子</a></li><li><a href="http://www.linxz.cn/" target="_blank" title="小志的BLOG">小志的BLOG</a></li><li><a href="http://naked.dustindiaz.com/" target="_blank" title="让更多的人注重表现和结构分离">CSS 裸奔节日</a></li>
<li><a href="http://www.webdna.cn/" target="_blank" title="朋友的网站">webdna.cn</a></li><li><a href="http://zishu.cn/" target="_blank" title="秀才的BLOG">子鼠</a></li><li><a href="http://www.msleft.com/" target="_blank" title="爱左看右的个人小屋">爱左看右</a></li>
<li><a title="可爱的藤藤猪MM！" href="http://www.ttpig.com/" target="_blank">藤藤猪MM'sBLOG</a></li>
<li><a href="http://www.diynow.cn/b/" target="_blank" title="经典飞扬">我，不拉狗</a></li>
<li><a href="http://hi.baidu.com/zjf44262" target="_blank" title="可爱的费人">费人本色</a></li><li><a href="http://www.oklrc.com/" title="傲客lrc歌词 在线影院 FLASH动画等" target="_blank" alt="傲客">傲客</a></li><li><a href="http://blog.pr1984.com/" title="热情的要命的PR" target="_blank" alt="PR的空间">打P侃天之专属</a></li><li><a href="http://hi.baidu.com/zhdd11" title="秀秀老师的'BLOG" target="_blank" alt="快乐人生">秀秀的快乐人生</a></li><li><a href="http://bbs.koolou.com/" title="骷髅网" target="_blank" alt="骷髅网">骷髅网</a></li><li><a href="http://mypea.cn/" title="Bencen" target="_blank" alt="Bencen">经典Bencen</a></li><li><a href="http://www.boblogger.com/" title="心灵持乐园-知识..。另一头的子乌" target="_blank" alt="蓝橙网">蓝橙网</a></li><li><a href="http://www.g-carton.com/blog" title="绿色动画的BLOG" target="_blank" alt="绿色动画">绿色动画</a></li><li><a href="http://blog.muwawa.com/" title="木娃娃的BLOG" target="_blank" alt="木娃娃">木娃娃</a></li>
<li><a href="http://www.wenuo.com/" title="">文学、散文、冷韵</a></li><li><a href="http://www.planabc.net/" title="开始落草网站标准化与用户体验">PlanABC-落草为根</a></li>
<li><a href="http://star.ysub.cn/" title="BI的朋友...设计师哦...">keroの星河树</a></li>
<li><a href="http://www.yusea.cn/" title="雨弓GG的雨丝"> 雨丝 </a></li><li><a href="http://www.hengzhezou.com/" title="BI的版主哟^_^"> 我就横着走 </a></li>
<li><a href="http://www.flym.cn/" target="_blank" title="经典Afly">飛's Blog </a></li>
<li><a href="http://www.chenyixin.com/" target="_blank" title="深空">★。ㄣ凡間灬</a></li>
<li><a href="http://www.yiger.net/" target="_blank" title="Yiger'blog">Yiger'blog</a></li>
<li><a href="http://www.zhaozhaozhu.com/" target="_blank" title="以懒人的方式解决费人的问题 ">费人的新BLOG</a></li><li><a href="http://www.cw951.com/" target="_blank" title=" 经典的朋友--良哥的BLOG ">永远的亚特兰蒂斯</a></li>
<li><a href="http://www.icegg.cn/" target="_blank" title=" 经典的朋友--超版蛋蛋的BLOG ">蛋蛋'Blog</a></li>
<li><a href="http://xqin.cn/" target="_blank" title=" 经典的朋友--全能的小子小秦">小秦</a></li><li><a href="http://www.happyshow.org/" target="_blank" title="努力每一天">快乐笛子的博客</a></li>


        </ul>
      </li>
      <li>
      </li><li><h2><a href="http://chenefei.com/links.asp">查看其他的友情链接</a></h2></li>
      <li>
        <div id="ggtj" style="">
        </div>
      </li>
    </ul>
  </div>
  <div id="content">
    <div class="navigation"><div class="alignleft"><a class="l" href="http://chenefei.com/post/37.html" title="上一篇日志">« 理发了！</a></div>
<div class="alignright"><a class="r" href="http://chenefei.com/post/39.html" title="下一篇日志">无意中发现的～ »</a></div></div>

<div class="post" id="post-#article/category/id#">
  <h3>html+css小技巧收集！</h3>
  <div class="entry" id="cczoom"><div style="margin: 0px; float: right;" id="content_right"><script type="text/JavaScript"> 
alimama_pid="mm_10009873_105890_301913"; 
alimama_titlecolor="0000FF"; 
alimama_descolor ="000000"; 
alimama_bgcolor="FFFFFF"; 
alimama_bordercolor="E6E6E6"; 
alimama_linkcolor="008000"; 
alimama_bottomcolor="FFFFFF"; 
alimama_anglesize="0"; 
alimama_bgpic="0"; 
alimama_icon="0"; 
alimama_sizecode="31"; 
alimama_width=180; 
alimama_height=250; 
alimama_type=2; 
</script> 
<script src="38_files/inf.js" type="text/javascript"> 
</script><img src="38_files/alimamal.htm" name="alimamatmpf0.8522280646291002" id="alimamatmpf0.8522280646291002" style="border: 0px none ; margin: 0px; padding: 0px; width: 0px; height: 0px; vertical-align: baseline;" border="0"><iframe name="alimamaf0.8522280646291002" id="alimamaf0.8522280646291002" border="0" marginwidth="0" marginheight="0" style="width: 180px; height: 250px;" src="38_files/alimama_002.htm" scrolling="no" frameborder="0"></iframe></div> <b>1.鼠标移上去是出现一个window的保存收藏打印的那个小框框，能不能限制它的出现？</b><br><p class="code">1.&nbsp;在HEAD中加入<br>&lt;META&nbsp;HTTP-EQUIV="imagetoolbar"&nbsp;CONTENT="no"&gt;<br><br>&lt;b&gt;2.&nbsp;图片上用新属性galleryimg&lt;/b&gt;<br>&lt;img&nbsp;width=500&nbsp;height=500&nbsp;src=a.gif&nbsp;galleryimg="no"&gt;&nbsp;</p><br><b>3.div实现滚动条 </b><br>(某些情况下可以替代iframe)<br><p class="code">&lt;style&gt;<br>.gb&nbsp;{&nbsp;overflow:auto;&nbsp;white-space:normal;&nbsp;height:100px;&nbsp;padding:3px;}<br>&lt;/style&gt;<br>&lt;div&nbsp;class="gb"&gt;&lt;/div&gt;<br></p>其中高度height和overflow是必须设置的！<br>ps:在IE下有的时候水平滚动条会出来，但是事实上，水平滚动条不没有实际的用途，貌似这个是IE的ｂｕｇ，解决方法：<p class="code">overflow-x:&nbsp;hidden</p>　加上这个．把水平滚动条隐藏掉～<br><b>4.用css来实现三角形</b><textarea class="code" rows="7" cols="50" id="runcode24967">&lt;style&gt;
.t{
  width:50px;
  border-style:solid;
  border-color:#a6a2f7 #fff; 
  border-width:0 50px 50px 50px; 
}
&lt;/style&gt;
&lt;span class="t"&gt;&lt;/span&gt;</textarea><br><input value="运行代码" onclick="runcode('runcode24967')" type="button"> <input value="复制代码" onclick="CopyText(document.all.runcode24967)" type="button"> [ 可以先修改再运行 ]<br><b>5. 用vml来画圆角...</b><br><textarea class="code" rows="7" cols="50" id="runcode98668">&lt;html xmlns:v&gt;
&lt;head&gt;
&lt;style&gt;
v\:* {behavior: url(#default#VML);}
#lone {
	width:200;
	height:70px;
}
&lt;/style&gt;
&lt;/head&gt;
&lt;body&gt; 
&lt;v:RoundRect id="lone" strokecolor="#000" strokeweight="4px" arcsize="0.8" fillcolor="#ff0000"&gt;
&lt;!--arcsize 弧度值 fillcolor 圆的填充色 strokecolor 圆的边框色 strokeweight 边框大小--&gt;
&lt;/body&gt;
&lt;/html&gt;</textarea><br><input value="运行代码" onclick="runcode('runcode98668')" type="button"> <input value="复制代码" onclick="CopyText(document.all.runcode98668)" type="button"> [ 可以先修改再运行 ]<br><b>6 . IE下,当使用了FLOAT之后.用margin-left和margin-right 会变成用双倍的数值</b><br>例子:<br>margin-left:10px; 实际的效果是20PX;<br>解决的方法:(1),用display:inline;(2)用clear:float <br>方法1适应的范围比较广一些,(2)的话.只适合那些可以清除浮动的元素.不能清除的,不能用~<br><br><b>7.在mozilla firefox和IE中的BOX模型解释不一致导致相差2px解决方法：</b><br><br><p class="code">div{margin:30px!important;margin:28px;}</p>注意这两个margin的顺序一定不能写反，据阿捷的说法!important这个属性IE不能识别，但别的浏览器可以识别。所以在IE下其实解释成这样：<br>div{maring:30px;margin:28px}<br>重复定义的话按照最后一个来执行，所以不可以只写margin:XXpx!important;<br><br><b>8.IE5和IE6的BOX解释不一致IE5下</b><br><p class="code">div{width:300px;margin:0&nbsp;&nbsp;10px&nbsp;&nbsp;0&nbsp;&nbsp;10px;}</p>div的宽度会被解释为300px-10px(右填充)-10px(左填充)最终div的宽度为280px，而在IE6和其他浏览器上宽度则是以300px+10px(右填充)+10px(左填充)=320px来计算的。这时我们可以做如下修改:<br><br><p class="code">div{width:300px!important;width&nbsp;&nbsp;/**/:340px;margin:0&nbsp;&nbsp;10px&nbsp;&nbsp;0&nbsp;&nbsp;10px}</p><br>这个/**/是IE5和firefox都支持但IE6不支持.<br><b><br>9.ul标签在Mozilla中默认是有padding值的,而在IE中只有margin有值所以先定义</b><br><br><p class="code">ul{margin:0;padding:0;}</p><br><br><b>10。div＋css布局用了float之后背景不能延伸的解决方案</b><br><p class="code">&lt;div&nbsp;style="clear:&nbsp;both;&nbsp;font-size:&nbsp;0;"&gt;&lt;/div&gt;</p>原因：背景的自适应高度并不继承float的高度，背景会继承float底线所在容器中的位置高度，所以背景一定会找到最后一个标签去测定，这样我们在如上的标签，这个标签中什么也不放。也就是一个没有高度的空容器，这样它就可以把背影拉下来了。<br><br><br><b>11.用 CSS 实现 Firefox 和 IE 都支持的 Alpha 透明效果</b> <br>filter:alpha(opacity=50);       /* IE */ <br>-moz-opacity:0.5;               /* Moz + FF */<br>opacity: 0.5;                   /* 支持CSS3的浏览器（FF 1.5也支持）*/  <br><br>IE使用私有属性filter:alpha(opacity)，Moz Family使用私有属性-moz-opacity，而标准的属性是opacity（CSS 3, Moz Family部分支持CSS3）。后面的数值是透明度，使用百分比或者小数。<br><br><b>12.未知大小的图片在一个已知大小容器中的水平和垂直居中</b><br>这个水平和垂直居中的例子能正常工作在IE5.x, IE6, IE7, Firefox, Opera, Mozilla, Netscape，为IE和非IE分别写了二套简单的样式。<br><br>IE使用inline-blocks，非IE使用table-cell and vertical-align。<br><br><br><b>CSS</b><br><p class="code">/*&nbsp;for&nbsp;non-IE&nbsp;browsers&nbsp;*/<br>div.holder&nbsp;{width:750px;&nbsp;height:300px;&nbsp;background:#f8f8f8;&nbsp;<br>border:1px&nbsp;solid&nbsp;#777;&nbsp;text-align:center;&nbsp;display:table-cell;&nbsp;vertical-align:middle;}<br>}&lt;!--[if&nbsp;IE]&gt;<br>&lt;style&nbsp;type="text/css"&gt;<br>/*&nbsp;vertical&nbsp;align&nbsp;for&nbsp;IE&nbsp;*/<br>#edge&nbsp;{width:0;&nbsp;height:100%;&nbsp;display:inline-block;&nbsp;vertical-align:middle;}&nbsp;<br>#container&nbsp;{text-align:center;&nbsp;width:100%;&nbsp;display:inline-block;&nbsp;vertical-align:middle;}<br>&lt;/style&gt;<br>&lt;![endif]--&gt;<br></p><b>xhtml</b><br><p class="code">&lt;div&nbsp;class="holder"&gt;&lt;span&nbsp;id="edge"&gt;&lt;/span&gt;&nbsp;&lt;span&nbsp;id="container"&gt;&lt;img&nbsp;src="graphics/homework.jpg"&nbsp;alt=""&nbsp;/&gt;&lt;/span&gt;<br>&lt;/div&gt;</p><br><b>13 .在IE里面元素浮动之后.原来的边距(margin)会加倍,但是FF等就不会.</b><br>解决方法<br>在浮动的元素的代码中加入：display: inline;，可使浮动被忽略，IE中不至于产生双倍距离.<br><br><b>14. 首页下沉的效果:</b><br>.post-body:first-letter
{font-size:2.5em; float:left; padding:0 2px 0 0; line-height:1em;
font-family:"楷体_GB2312"; font-weight:bold; color:#b00;}<br><br><b>15.半透明的效果</b><br><textarea class="code" rows="7" cols="50" id="runcode51007">&lt;div
style="width:100px;height:100px;background-color:#f00;filter:alpha(opacity=50);
/* IE */ ; -moz-opacity:0.5; /* Moz + FF */ ; opacity: 0.5; /*
支持CSS3的浏览器（FF 1.5也支持）*/"&gt;
我在任何浏览器里都是半透明的
&lt;/div&gt;</textarea><br><input value="运行代码" onclick="runcode('runcode51007')" type="button"> <input value="复制代码" onclick="CopyText(document.all.runcode51007)" type="button"> [ 可以先修改再运行 ]<br><br><b>16.去掉点击链接时出现的虚线框</b><br><textarea class="code" rows="7" cols="50" id="runcode93991">IE下　：&lt;a href="http://chenefei.com" hidefocus="true"&gt;试一试&lt;/a&gt;

FF下：直接给标签 a 定义样式 outline:none; 就可以了，即：

a {
 outline:none;
}</textarea><br><input value="运行代码" onclick="runcode('runcode93991')" type="button"> <input value="复制代码" onclick="CopyText(document.all.runcode93991)" type="button"> [ 可以先修改再运行 ]<br><br><b>17.Flash背景透明</b><br><p class="code">//IE&nbsp;<br>&lt;param&nbsp;name="wmode"&nbsp;value="opaque"&nbsp;/&gt;&nbsp;<br>//ff在&lt;embed&gt;标签内添加<br>&nbsp;menu="false"&nbsp;wmode="transparent"&nbsp;<br></p><br><b>17.让 链接的提示（title）换行</b> ：<br>在需要换行的地方插入 ： <textarea class="code" rows="7" cols="50" id="runcode18154"></textarea><br><input value="运行代码" onclick="runcode('runcode18154')" type="button"> <input value="复制代码" onclick="CopyText(document.all.runcode18154)" type="button"> [ 可以先修改再运行 ]<br><br><b>18. 行内强制断行 ，且在允许英文单词内断行</b><br><p class="code">white-space:normal;word-wrap:word-break;word-wrap</p><br><b>19.浮动或者改变ol的默认内外补丁值之后引起的序号丢失</b><br><p class="code">list-style-position:inside&nbsp;<br>/*默认情况下他的属性是outside*/</p><br>如果你没有声明或给li列表项设置了宽度，可能会出现不按顺序显示的奇怪现象 全部是1的情况，<br>解决的方法是去旧li的宽度声明，或将宽度属性的值设为auto。
    <p class="postmetadatasingle"> 发布:<a href="http://chenefei.com/catalog.asp?auth=1">飞飞</a> | 分类:<a href="http://chenefei.com/catalog.asp?cate=1">特效收集</a> | <a href="http://chenefei.com/post/38.html#comment">评论</a>:<a href="http://chenefei.com/post/38.html#comms">5</a> | 浏览:
      <script type="text/javascript" src="38_files/c_count_js.asp"></script>1187
      | 字号:<a href="javascript:doZoom(16)">大</a> <a href="javascript:doZoom(14)">中</a> <a href="javascript:doZoom(12)">小</a> </p>
  </div>
</div>
<div id="ggads"><script type="text/javascript"><!--
google_ad_client = "pub-0654540925974488";
google_ad_width = 468;
google_ad_height = 15;
google_ad_format = "468x15_0ads_al_s";
//2007-04-13: 文章底部
google_ad_channel = "3536184509";
google_color_border = "FFFFFF";
google_color_bg = "FFFFFF";
google_color_link = "557700";
google_color_text = "000000";
google_color_url = "008000";
//-->
</script>
<script type="text/javascript" src="38_files/show_ads.js">
</script><iframe name="google_ads_frame" src="38_files/ads_005.htm" marginwidth="0" marginheight="0" vspace="0" hspace="0" allowtransparency="true" scrolling="no" width="468" frameborder="0" height="15"></iframe>
<script type="text/javascript"><!--
google_ad_client = "pub-0654540925974488";
google_ad_width = 468;
google_ad_height = 15;
google_ad_format = "468x15_0ads_al_s";
//2007-04-13: 文章底部
google_ad_channel = "3536184509";
google_color_border = "FFFFFF";
google_color_bg = "FFFFFF";
google_color_link = "557700";
google_color_text = "000000";
google_color_url = "008000";
//-->
</script>
<script type="text/javascript" src="38_files/show_ads.js">
</script><iframe name="google_ads_frame" src="38_files/ads_005.htm" marginwidth="0" marginheight="0" vspace="0" hspace="0" allowtransparency="true" scrolling="no" width="468" frameborder="0" height="15"></iframe>
</div>
<ol class="commentlist" lang="en">
  
<li id="comment-1">
  <div class="commentinfo">
    <p>1.<cite><a href="http://www.linxz.cn/" title="http://www.linxz.cn" target="_blank">小志</a></cite> 说 <small class="commentmetadata"> 发表评论于2007-3-10 10:38:37<a href="mailto:linxz428%5BAT%5Dgmail.com" onclick="this.href=(this.href).replace(/\[AT\]/,String.fromCharCode(64));">发送邮件</a> <a href="http://www.linxz.cn/" rel="nofollow" target="_blank">个人网站</a></small></p>
  </div>
  <p>丫的，这么多好东西啊~等一下全部偷到自己的BLOG上去。</p>
</li>

<li id="comment-2">
  <div class="commentinfo">
    <p>2.<cite><a href="http://chenefei.com/" title="http://chenefei.com" target="_blank">飞飞</a></cite> 说 <small class="commentmetadata"> 发表评论于2007-3-10 11:27:49<a href="mailto:chyf1982%5BAT%5Dhotmail.com" onclick="this.href=(this.href).replace(/\[AT\]/,String.fromCharCode(64));">发送邮件</a> <a href="http://chenefei.com/" rel="nofollow" target="_blank">个人网站</a></small></p>
  </div>
  <p>呵呵，一点点，满满收集吧。。<br></p>
</li>

<li id="comment-3">
  <div class="commentinfo">
    <p>3.<cite><a href="" title="" target="_blank">ryan</a></cite> 说 <small class="commentmetadata"> 发表评论于2007-3-29 16:33:37<a href="mailto:hero3216%5BAT%5D163.com" onclick="this.href=(this.href).replace(/\[AT\]/,String.fromCharCode(64));">发送邮件</a> <a href="" rel="nofollow" target="_blank">个人网站</a></small></p>
  </div>
  <p>不错。</p>
</li>

<li id="comment-4">
  <div class="commentinfo">
    <p>4.<cite><a href="" title="" target="_blank">qin</a></cite> 说 <small class="commentmetadata"> 发表评论于2007-12-19 16:46:59<a href="mailto:tanxueqin808%5BAT%5D126.com" onclick="this.href=(this.href).replace(/\[AT\]/,String.fromCharCode(64));">发送邮件</a> <a href="" rel="nofollow" target="_blank">个人网站</a></small></p>
  </div>
  <p>谢谢呀，这么多的好东西1</p>
</li>

<li id="comment-5">
  <div class="commentinfo">
    <p>5.<cite><a href="http://imfei.com/" title="http://imfei.com" target="_blank">飞飞</a></cite> 说 <small class="commentmetadata"> 发表评论于2007-12-20 14:35:56<a href="mailto:chyf1982%5BAT%5Dhotmai.com" onclick="this.href=(this.href).replace(/\[AT\]/,String.fromCharCode(64));">发送邮件</a> <a href="http://imfei.com/" rel="nofollow" target="_blank">个人网站</a></small></p>
  </div>
  <p>很高兴你也能用上 :)</p>
</li>

  <div class="post" id="divCommentPost">
  <h3>我来说几句:</h3>
  <form id="frmSumbit" method="post" action="http://chenefei.com/cmd.asp?act=cmt">
    <input name="inpId" id="inpId" value="38" type="hidden">
    <input name="inpArticle" id="inpArticle" value="" type="hidden">
    <input name="inpLocation" id="inpLocation" value="" type="hidden">
   <p>
      <label for="inpName">名称(*)</label><input name="inpName" id="inpName" class="text" value="" size="28" tabindex="1" type="text">
    </p>
    <p>
     <label for="inpEmail">邮箱(*)</label> <input name="inpEmail" id="inpEmail" class="text" value="" size="28" tabindex="2" type="text">
      
    </p>
    <p>
      <label for="inpHomePage"><acronym title="Please input your website url." lang="en">网站链接</acronym></label><input name="inpHomePage" id="inpHomePage" class="text" value="" size="28" tabindex="3" type="text">      
    </p>
    <script language="JavaScript" src="38_files/c_html_js_002.asp" type="text/javascript"></script>
<p>
  <label for="inpVerify">验证(*)</label>
  <input name="inpVerify" id="inpVerify" class="text" value="" size="28" tabindex="4" type="text">
  <label for="inpVerify"></label>
  <b id="frmCommentVerify" style="border: 1px solid rgb(153, 153, 153); padding: 2px;"><img src="38_files/c_validcode_003.gif" alt="" title="" width="10" height="14"> <img src="38_files/c_validcode_002.gif" alt="" title="" width="10" height="14"> <img src="38_files/c_validcode.gif" alt="" title="" width="10" height="14"> <img src="38_files/c_validcode_004.gif" alt="" title="" width="10" height="14"></b></p>

    <p>
      <label for="txaArticle">正文(*)(留言最长字数:1000)</label>
    </p>
    <p>
      <textarea name="txaArticle" id="txaArticle" onchange="GetActiveText(this.id);" onclick="GetActiveText(this.id);" onfocus="GetActiveText(this.id);" class="text" cols="50" rows="4" tabindex="5"></textarea>
    </p>
    <p>
      <input name="btnSumbit" tabindex="6" value="就说这些吧..." onclick="JavaScript:return VerifyMessage()" class="button" type="submit">
      <input name="chkRemember" value="1" id="chkRemember" type="checkbox">
      <label for="chkRemember">记住我,下次回复时不用重新输入个人信息</label>
    </p>
 </form>
  <script language="JavaScript" type="text/javascript">LoadRememberInfo();</script>
</div>

</ol>
 </div>
    <div id="footer">
      <p><a href="http://www.miibeian.gov.cn/" class="copyright" target="_blank">备案信息:浙ICP备06040345号/浙ICP备06043944号</a>&nbsp; &nbsp;网站程序:<a class="copyright" href="http://www.5iya.com/plus" title="Z-Blog Plus" target="_blank">Z-BLOG PLUS</a>&nbsp; &nbsp;版权所有:<a href="http://chenefei.com/" name="top">飞飞</a></p>
    </div>
  </div>
  <script language="JavaScript" type="text/javascript">
var str00="http://chenefei.com/";
var str01="名称或邮箱不能为空";
var str02="名称或邮箱格式不对";
var str03="留言不能为空或过长";
var str06="显示UBB表情>>";
var intMaxLen="1000";
var strFaceName="Sly smile|Big smile|Biggest smile|Tease|Starry|Flattered|Boy smile|Girl smile 3|Happy|Kissed|Surprise|Split|Fright|Capo mafioso|Sad|Bad surprise|Fear|Closed up|Cry|Fury|Alien|Bloody|Bomb|Hatred|Song|Prodigy|Snowman|Yin-yang|Mail|Blue";
var strFaceSize="48";
function runcode(code1){
code2=document.getElementById(code1);
var code3=code2.value;
if (code3!=""){
var newwin=window.open('','','');
newwin.opener = null;
newwin.document.write(code3);
newwin.document.close();}}
function doZoom(size)
{document.getElementById('cczoom').style.fontSize=size+'px';}
</script>
  <div id="Tongji" style="display: none;">
    <script src="38_files/urchin.js" type="text/javascript">
</script>
    <script type="text/javascript">
_uacct = "UA-356771-2";
urchinTracker();
</script>
    <script language="javascript" src="38_files/click.htm"></script><a href="http://count.51yes.com/index.aspx?id=190613470" target="_blank"><img src="38_files/count8.gif" alt="51YES网站统计系统" vspace="0" width="20" border="0" height="20" hspace="0"></a><iframe marginwidth="0" marginheight="0" hspace="0" vspace="0" src="38_files/sa.txt" scrolling="no" width="0" frameborder="0" height="0"></iframe>
 <!-- GG bt-->
 <div id="ggbts">  <script type="text/javascript"><!--
google_ad_client = "pub-0654540925974488";
google_ad_width = 728;
google_ad_height = 90;
google_ad_format = "728x90_as";
google_ad_type = "image";
//2007-03-27: 页面顶部
google_ad_channel = "0006676948";
//-->
</script>
  <script type="text/javascript" src="38_files/show_ads.js">
</script><iframe name="google_ads_frame" src="38_files/ads_004.htm" marginwidth="0" marginheight="0" vspace="0" hspace="0" allowtransparency="true" scrolling="no" width="728" frameborder="0" height="90"></iframe></div>
	<!-- GG AD -->
<div id="ggad"><script type="text/javascript"><!--
google_ad_client = "pub-0654540925974488";
google_ad_width = 468;
google_ad_height = 15;
google_ad_format = "468x15_0ads_al_s";
//2007-04-13: 文章底部
google_ad_channel = "3536184509";
google_color_border = "FFFFFF";
google_color_bg = "FFFFFF";
google_color_link = "557700";
google_color_text = "000000";
google_color_url = "008000";
//-->
</script>
<script type="text/javascript" src="38_files/show_ads.js">
</script><iframe name="google_ads_frame" src="38_files/ads_005.htm" marginwidth="0" marginheight="0" vspace="0" hspace="0" allowtransparency="true" scrolling="no" width="468" frameborder="0" height="15"></iframe>
</div>
<div id="content_rights"><script type="text/JavaScript"> 
alimama_pid="mm_10009873_105890_301913"; 
alimama_titlecolor="0000FF"; 
alimama_descolor ="000000"; 
alimama_bgcolor="FFFFFF"; 
alimama_bordercolor="E6E6E6"; 
alimama_linkcolor="008000"; 
alimama_bottomcolor="FFFFFF"; 
alimama_anglesize="0"; 
alimama_bgpic="0"; 
alimama_icon="0"; 
alimama_sizecode="31"; 
alimama_width=180; 
alimama_height=250; 
alimama_type=2; 
</script> 
<script src="38_files/inf.js" type="text/javascript"> 
</script><img name="alimamatmpf0.8522280646291002" id="alimamatmpf0.8522280646291002" style="border: 0px none ; margin: 0px; padding: 0px; width: 0px; height: 0px; vertical-align: baseline;" border="0"><iframe name="alimamaf0.8522280646291002" id="alimamaf0.8522280646291002" border="0" marginwidth="0" marginheight="0" style="width: 180px; height: 250px;" src="38_files/alimama_002.htm" scrolling="no" frameborder="0"></iframe></div>
</div>
<script type="text/javascript">
function $(frm){
return document.getElementById(frm);}
$("ggbt").innerHTML=$("ggbts").innerHTML;
$("ggads").innerHTML=$("ggad").innerHTML;
$("ggads").innerHTML+=$("ggad").innerHTML;
$("content_right").innerHTML+=$("content_rights").innerHTML;
</script>
  

</body></html>